<template>
  <div>
    <el-button @click="addColumn">新增答疑</el-button>
    <message-list v-if="messageShow === 'list'" v-on:turnPage="turnPage"></message-list>
    <add-message v-if="messageShow === 'add'"></add-message>
    <display-message v-if="messageShow === 'display'"
                    :eid="eid"
                    v-on:turnPage="turnPage"></display-message>
    <edit-message v-if="messageShow === 'edit'"
                 :eid="eid"
                 v-on:turnPage="turnPage"></edit-message>
  </div>
</template>

<script>
  import addMessage from './AddMessage'
  import displayMessage from './DisplayMessage'
  import editMessage from './EditMessage'
  import messageList from './MessageList'
    export default {
        name: "MessageManage",
      components:{
          addMessage:addMessage,
        displayMessage:displayMessage,
        editMessage:editMessage,
        messageList:messageList
      },
      data() {
        return {
          messageShow: 'list',
          eid: ''
        }
      },
      methods: {
        turnPage(eid, type) {
          this.eid = eid;
          this.messageShow = type;
        },

        addColumn: function () {
          this.messageShow = 'add'
        }
      }
    }
</script>

<style scoped>

</style>
